<template>
	<div class="risk">
		<!-- <div class="add" @click="edit()">新增设备设施</div> -->
		<van-search class="info_search" v-model="value" placeholder="搜索" />
		<van-tabs v-model="active">
			<van-tab title="附件库">
				<van-list
					style="margin: 10px"
					:finished="finished"
					v-model="loading"
					finished-text="没有更多了"
					@load="onLoad"
				>
					<van-cell v-for="(item, index) in list" :key="index" style="margin-top: 10px">
						<van-card>
							<template #title>
								<h3>{{ item.CertName }}</h3>
							</template>
							<template #thumb>
								<!-- <img src="baseUrl + item.AttCover" alt=""> -->
								<van-image
									:src="baseUrl + item.AttCover"
									width="80"
									height="80"
								/>
							</template>
							<template #desc>
								<div>{{ item.AttName }}</div>
								<div>上传时间：{{ item.CreateDate }}</div>
							</template>
							<template #footer>
								<div class="footer-btns">
									<van-button size="mini" @click="edit(item)"
										>重命名</van-button
									>
									<van-button size="mini" @click="handleDelete(item)"
										>删除</van-button
									>
									<van-button size="mini" @click="submit(item)"
										>选择</van-button
									>
								</div>
							</template>
						</van-card>

						<van-tag v-if="item.ExpireDays > 0" class="tags" type="warning"
							>逾期{{ Math.abs(item.ExpireDays) }}天</van-tag
						>
						<van-tag v-if="item.ExpireDays < 0" class="tags" type="warning"
							>剩{{ Math.abs(item.ExpireDays) }}天</van-tag
						>
					</van-cell>
				</van-list>
			</van-tab>
			<!-- <van-tab title="我管理的证书">
        <van-list
          style="margin-top: 10px"
          :finished="myFinished"
          v-model="myLoading"
          finished-text="没有更多了"
          @load="myOnLoad"
        >
          <van-cell v-for="(item, index) in myList" :key="index">
            <van-card
              :title="item.CertName"
              :thumb="baseUrl+item.Attachs"
              @click="handleClick(item.ID)"
            >
              <template #desc>
                <div>姓名：{{ item.WorkCode }} {{ item.OrgName }}</div>
                <div>下次复审日期：{{ item.NextReviewDate }}</div>
              </template>
            </van-card>
            <van-tag v-if="item.ExpireDays > 0" class="tags" type="warning"
              >逾期{{ Math.abs(item.ExpireDays) }}天</van-tag
            >
            <van-tag v-if="item.ExpireDays < 0" class="tags" type="warning"
              >剩{{ Math.abs(item.ExpireDays) }}天</van-tag
            >
          </van-cell>
        </van-list>
      </van-tab> -->
			<!-- <van-tab title="我部门的证书">
        <van-list
          style="margin-top: 10px"
          :finished="finished"
          v-model="loading"
          finished-text="没有更多了"
          @load="onLoad"
        >
          <van-cell v-for="(item, index) in deptList" :key="index">
             <van-card
              :title="item.CertName"
              :thumb="baseUrl+item.Attachs"
              @click="handleClick(item.ID)"
            >
              <template #desc>
                <div>姓名：{{ item.ChnName }} {{ item.OrgName }}</div>
                <div>下次复审日期：{{ item.NextReviewDate }}</div>
              </template>
            </van-card>
            <van-tag v-if="item.ExpireDays > 0" class="tags" type="warning"
              >逾期{{ Math.abs(item.ExpireDays) }}天</van-tag
            >
            <van-tag v-if="item.ExpireDays < 0" class="tags" type="warning"
              >剩{{ Math.abs(item.ExpireDays) }}天</van-tag
            >
          </van-cell>
        </van-list>
      </van-tab> -->
		</van-tabs>
		<van-dialog
			v-model="show"
			title="修改附件名称"
			@confirm="handleConfirm()"
			show-cancel-button
		>
			<van-form>
				<van-field
					clickable
					name="Title"
					v-model="form.AttName"
					placeholder="请输入"
				/>
			</van-form>
		</van-dialog>
	</div>
</template>

<script>
import { fileList, changeFileName, deleteFile } from '@/api/cert'
import { Dialog } from 'vant'
export default {
	data() {
		return {
			baseUrl: process.env.VUE_APP_BASE_API,
			id: this.$route.query.id,
			active: 0,
			value: '',
			show: false,
			list: [],
			form: {},
			myList: [],
			deptList: [],
			selectKey: '',
			myFilter: {
				page: 0,
				dataType: 'MyManagerUserCert',
			},
			deptFilter: {
				page: 0,
				dataType: 'MyDeptUserCert',
			},
			filter: {
				page: 0,
				dataType: 'List',
			},
			loading: false,
			finished: false,
			myLoading: false,
			myFinished: false,
			deptLoading: false,
			deptFinished: false,
		}
	},
	created() {
		this.getList()
		// this.getMyList();
		// this.getDeptList();
	},
	methods: {
		submit(item) {
			this.$router.push({
				name: 'CertEdit',
				params: { certFile: item, id: this.id },
			})
		},
		// getMyList() {
		//   this.myLoading = true;
		//   list(this.myFilter).then((res) => {
		//     this.myLoading = false;
		//     if (!res.data.HasNextPage) {
		//       this.myFinished = true;
		//     }
		//     this.myList = res.data.Data;
		//     this.myFilter.page = res.data.PageIndex;
		//   });
		// },
		// getDeptList() {
		//   this.deptLoading = true;
		//   list(this.deptFilter).then((res) => {
		//     this.deptLoading = false;
		//     if (!res.data.HasNextPage) {
		//       this.myFinished = true;
		//     }
		//     this.deptList = res.data.Data;
		//     this.deptFilter.page = res.data.PageIndex;
		//   });
		// },
		getList() {
			this.loading = true
			fileList(this.filter).then((res) => {
				this.loading = false
				if (!res.data.HasNextPage) {
					this.finished = true
				}
				this.list = res.data.Data
				this.filter.page = res.data.PageIndex
			})
		},

		handleDelete(item) {
			Dialog.confirm({
				title: '询问',
				message: '确定要删除该条记录吗?',
			})
				.then(() => {
					// on confirm
					deleteFile({ id: item.ID }).then((res) => {
						this.$toast.success('删除成功！')
						this.getList()
						// console.log('asdasdsad',res);
					})
				})
				.catch(() => {
					// on cancel
				})
		},

		// myOnLoad() {
		//   this.myLoading = true;
		//   ++this.myFilter.page;
		//   list(this.myFilter).then((res) => {
		//     this.myLoading = false;
		//     this.myFilter.page = res.data.PageIndex;
		//     this.myList = this.myList.concat(res.data.Data);
		//     if (!res.data.HasNextPage) {
		//       this.myFinished = true;
		//     }
		//   });
		// },
		// deptOnLoad() {
		//   this.deptLoading = true;
		//   ++this.deptFilter.page;
		//   list(this.deptFilter).then((res) => {
		//     this.deptLoading = false;
		//     this.deptFilter.page = res.data.PageIndex;
		//     this.deptList = this.deptList.concat(res.data.Data);
		//     if (!res.data.HasNextPage) {
		//       this.deptFinished = true;
		//     }
		//   });
		// },

		onLoad() {
			this.loading = true
			++this.filter.page
			fileList(this.filter).then((res) => {
				this.loading = false
				this.filter.page = res.data.PageIndex
				this.list = this.list.concat(res.data.Data)
				if (!res.data.HasNextPage) {
					this.finished = true
				}
			})
		},

		edit(obj) {
			if (obj) {
				this.form.ID = obj.ID
				this.form.AttName = obj.AttName
			} else {
				this.form = {}
			}

			this.show = true
		},
		handleConfirm() {
			changeFileName(this.form).then((res) => {
				this.$toast.success('编辑成功！')
				this.getList()
			})
		},
	},
}
</script>
<style lang="less" scoped>
.risk {
	height: 100vh;
	background-color: #e8f1f8;
	.info_search {
		padding: 10px;
		border-radius: 5px !important;
		.van-field__control {
			background-color: #ffffff !important;
		}
	}
}
.all_dep {
	background-color: #ffffff;
}
.van-cell {
	padding: 0 0;
	border-radius: 8px;
}
.warn_item {
	/*margin-bottom: 10px;*/
	padding: 10px 0 10px 10px;
	border-radius: 5px;
	position: relative;
}
.warn_header {
	display: flex;
	justify-content: space-between;
	position: relative;
	margin-bottom: 10px;
	.warn_tag {
		position: absolute;
		right: 0;
		top: 0;
		border-radius: 26.64rem 0 0 26.64rem;
	}
}
.dep_sort {
	display: flex;
	align-items: center;
	margin-bottom: 5px;
	img {
		height: 15px;
		width: 15px;
		margin-right: 5px;
	}
}
.dep_btm {
	display: flex;
	justify-content: flex-end;
	.btm_item {
		display: flex;
		align-items: center;
		img {
			height: 15px;
			width: 15px;
			margin-right: 5px;
		}
	}
}
.van-image {
	box-shadow: 3px 3px 3px #ccc;
}
.tags {
	position: absolute;
	right: 0;
	top: 10px;
	border-radius: 26.64rem 0 0 26.64rem;
}
.file-list {
	background-color: #e8f1f8;
}
.van-cell {
	padding: 0 0;
	border-radius: 8px;
}
.footer-btns {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 10px;
}
</style>



